<template>
    <div class="home-container">
        <el-breadcrumb separator="/">
            <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
            <el-breadcrumb-item><a href="/">商品管理</a></el-breadcrumb-item>
            <el-breadcrumb-item><a href="/">店铺列表</a></el-breadcrumb-item>
          </el-breadcrumb>
          <el-card>
            <el-row :gutter="20">
              <el-col :span="8">
                <el-input placeholder="请输入" v-model="queryInfo.query" clearable @clear="getShopList">
                  <el-button slot="append" icon="el-icon-search" @click="getShopList"></el-button>
                </el-input>
              </el-col>
              <el-col :span="4">
                <el-button type="primary" @click="openDialog">添加店铺</el-button>
              </el-col>
            </el-row>
            <el-table
            :data="shopList"
            style="width: 100%; margin-top: 20px"
            border
            stripe
          >
            <el-table-column type="index" label="序号"> </el-table-column>
            <el-table-column prop="shopName" label="店铺名称"> </el-table-column>
            <el-table-column fixed="right" label="操作" width="200">
              <template>
                <!-- 修改按钮 -->
                <el-button
                  type="primary"
                  icon="el-icon-edit"
                  size="mini"
                  class="btn-blue"

                ></el-button>
                <!-- 删除按钮 -->
                <el-button
                  type="danger"
                  icon="el-icon-delete"
                  size="mini"
                ></el-button>
              </template>
            </el-table-column>
          </el-table>
          </el-card>
    </div>
</template>
<script>
export default {
  data () {
    return {
      shopList: [],
      queryInfo: {
        shopName: '',
        limit: 10,
        page: 1
      },
      openDialog: false
    }
  },
  created () {
    this.getShopList()
  },
  computed: {
  },
  methods: {
    async getShopList () {
      const { data: res } = await this.$http.post('/goods/getShopList', this.queryInfo)
      if (res.code !== 200) return this.$message.error(res.msg)
      this.shopList = res.data
    }
  }
}
</script>
<style lang="less" scoped>

</style>
